<!DOCTYPE html>
<html lang="en"
      xmlns="http://www.w3.org/1999/xhtml"
      xmlns:f="http://java.sun.com/jsf/core"
      xmlns:h="http://java.sun.com/jsf/html"
      xmlns:ui="http://java.sun.com/jsf/facelets"
      xmlns:p="http://primefaces.org/ui"
        >
<h:head>
    <title>SONES</title>
    <h:outputStylesheet library="css" name="default.css"  />
</h:head>
<h:body>
    <p:dock position="top">
        <p:menuitem value="Accueil" icon="/resources/images/home.png" url="#"/>
        <p:menuitem value="Planification" icon="/resources/images/simulation.png" url="#"/>
        <p:menuitem value="Mon Compte" icon="/resources/images/history.png" url="#"/>
        <p:menuitem value="Preferences" icon="/resources/images/history.png" url="#"/>
    </p:dock>
    <h:form>

        <p:growl id="growl" sticky="true" showDetail="true"/>

        <p:wizard flowListener="#{homeController.onFlowProcess}" showNavBar="true" >

            <p:tab id="personal" title="Personal">

                <p:panel header="Personal Details">

                    <h:messages errorClass="error"/>

                    <h:panelGrid columns="2" columnClasses="label, value" styleClass="grid">
                        <h:outputText value="Firstname: *" />
                        <p:inputText required="true" label="Firstname"
                                     value="" />

                        <h:outputText value="Lastname: *" />
                        <p:inputText required="true" label="Lastname"
                                     value="" />

                        <h:outputText value="Age: " />
                        <p:inputText value="" />

                        <h:outputText value="Skip to last: " />
                        <h:selectBooleanCheckbox value="" />
                    </h:panelGrid>
                </p:panel>
            </p:tab>

            <p:tab id="address" title="Address">
                <p:panel header="Adress Details">

                    <h:messages errorClass="error"/>

                    <h:panelGrid columns="2" columnClasses="label, value">
                        <h:outputText value="Street: " />
                        <p:inputText value="" />

                        <h:outputText value="Postal Code: " />
                        <p:inputText value="" />

                        <h:outputText value="City: " />
                        <p:inputText value="" />

                        <h:outputText value="Skip to last: " />
                        <h:selectBooleanCheckbox value=" " />
                    </h:panelGrid>
                </p:panel>
            </p:tab>

            <p:tab id="contact" title="Contact">
                <p:panel header="Contact Information">

                    <h:messages errorClass="error"/>

                    <h:panelGrid columns="2" columnClasses="label, value">
                        <h:outputText value="Email: *" />
                        <p:inputText required="true" label="Email"
                                     value="" />

                        <h:outputText value="Phone: " />
                        <p:inputText value=""/>

                        <h:outputText value="Additional Info: " />
                        <p:inputText value=""/>
                    </h:panelGrid>
                </p:panel>
            </p:tab>

            <p:tab id="confirm" title="Confirmation">
                <p:panel header="Confirmation">

                    <h:panelGrid id="confirmation" columns="6">
                        <h:outputText value="Firstname: " />
                        <h:outputText styleClass="outputLabel"
                                      value="" />

                        <h:outputText value="Lastname: " />
                        <h:outputText  styleClass="outputLabel"
                                       value=""/>

                        <h:outputText value="Age: " />
                        <h:outputText styleClass="outputLabel"
                                      value="" />

                        <h:outputText value="Street: " />
                        <h:outputText styleClass="outputLabel"
                                      value="" />

                        <h:outputText value="Postal Code: " />
                        <h:outputText styleClass="outputLabel"
                                      value="" />

                        <h:outputText value="City: " />
                        <h:outputText styleClass="outputLabel"
                                      value="" />

                        <h:outputText value="Email: " />
                        <h:outputText styleClass="outputLabel"
                                      value="" />

                        <h:outputText value="Phone " />
                        <h:outputText styleClass="outputLabel"
                                      value=""/>

                        <h:outputText value="Info: " />
                        <h:outputText styleClass="outputLabel"
                                      value="" />

                        <h:outputText />
                        <h:outputText />
                    </h:panelGrid>

                    <p:commandButton value="Submit" update="growl" actionListener="#{homeController.updateUser}"/>

                </p:panel>
            </p:tab>

        </p:wizard>

    </h:form>
</h:body>
</html>
